<template>
  <view>
    <z-paging ref="pagingRef" @query="queryList" v-model="list">
      <template #top>
        <view style="height: 100px"></view>
      </template>
      <DropdownFilter :filterData="filterData" :defaultIndex="defaultIndex"
                      @onSelected="onSelected" @dateChange="dateChange" @reset="reset"></DropdownFilter>
      <view v-for="(item,index) in list" :key="index">
        <view @click="toDetail(item)">
          <ArticleItem2 :article-item="item">
            <template #header>
              <view class="solids-bottom padding-bottom-xs flex flex-sub justify-between align-center margin-bottom-xs">
                <view class="flex flex-sub align-center">
                  <view :style="'color:'+getArticleStatusColor(item.status)" class="cuIcon-title"></view>
                  <view>{{ getArticleStatus(item.status) }}</view>
                </view>
                <view>{{ item.updateTime }}</view>
              </view>
            </template>
          </ArticleItem2>
        </view>
      </view>
    </z-paging>
    <view>
      <uni-fab
          :pattern="pattern"
          horizontal="right"
          vertical="bottom"
          @fabClick="handleAdd"
      ></uni-fab>
    </view>
  </view>
</template>

<script setup lang="ts">
import {defineExpose, ref} from "vue";
import api from "@/api";
import {useUserStore} from "@/store";
import {imagePathPrefix} from '/settings'
import {getArticleStatus, getArticleStatusColor} from "@/utils";
import ArticleItem2 from "@/components/common/item/ArticleItem2.vue";
import DropdownFilter from "@/pages/nurse/appointment/components/DropdownFilter.vue";

const prefix = imagePathPrefix
const userStore = useUserStore()

const list = ref([])
const pattern = {
  color: '#7A7E83',
  backgroundColor: '#fff',
  selectedColor: '#007AFF',
  buttonColor: '#007AFF',
  iconColor: '#fff'
}
const pagingRef = ref()
const andParams = ref({
  username: userStore.userInfo.username,
  status:'',
  createTime:'',
})
const orParams = ref({})
const orderParams = ref({
  updateTime: '2',
})

const filterData = [
  [{text: '全部状态', value: ''}, {text: '编辑中', value: '0'}, {text: '审核中', value: '1'}, {
    text: '已发布',
    value: '2'
  }, {text: '未通过', value: '3'}]
]
const defaultIndex = [0,]
const onSelected = (e: any) => {
  andParams.value.status = e[0][0].value
  pagingRef.value.reload()
}
const dateChange = (e: string) => {
  andParams.value.createTime = e
  pagingRef.value.reload()
}
const reset = () => {
  andParams.value.status = ''
  andParams.value.createTime = ''
  pagingRef.value.reload()
}

const queryList = (pageNo: any, pageSize: any) => {
  api.article.list({
    pageNo: pageNo,
    pageSize: pageSize,
    andParams: JSON.stringify(andParams.value),
    orParams: JSON.stringify(orParams.value),
    orderParams: JSON.stringify(orderParams.value),
  }).then(res => {
    if (res && res.data.code === 0) {
      let tmp = res.data.data.records
      pagingRef.value.complete(tmp);
    }
  })
}

const toDetail = (item: any) => {
  uni.navigateTo({
    url: '/pages/nurse/article/detail?articleInfo=' + encodeURIComponent(JSON.stringify(item))
  })
}

const handleAdd = () => {
  uni.navigateTo({
    url: '/pages/nurse/article/detail'
  })
}
const pageListReload = () => {
  pagingRef.value.reload()
}
defineExpose({
  pageListReload
})
</script>

<style scoped>

</style>